<!-- <NuxtPage /> 组件添加到 app.vue（或者删除 app.vue 以使用默认入口）。 -->
<template>
  <div class="app-container">
    <NuxtLoadingIndicator color="#368fff" />
    <!-- 通过在 app.vue 中添加 <NuxtLayout>，可以启用布局 -->
    <NuxtLayout>
      <NuxtPage />
      <AppFooter />
    </NuxtLayout>
  </div>
</template>

<script setup lang="ts">
// 使用静态导入以实现服务器端兼容性
// import '~/assets/css/first.css'
const description = ref('脑洞在线3D打印')
/**
 * SEO和Meta
 * 使用强大的头部配置、组合函数和组件来提升你的Nuxt应用的SEO。
*/
// useHead 组合函数允许你以编程和响应式的方式管理头部标签
// useHead({
//   meta: [
//     { name: 'description', content: description }
//   ],
// })
// useSeoMeta 组合函数允许你将站点的SEO元标签定义为一个扁平的对象，并提供完整的TypeScript支持。
updateSEO({})
</script>


<style lang="scss">
// 引入element-plus css
@import 'element-plus/dist/index.css';
@import url("~/assets/flex.scss");
// 页面动画
.page-enter-active,
.page-leave-active {
  transition: all 0.4s;
}
.page-enter-from,
.page-leave-to {
  opacity: 0;
  filter: blur(50px);
}
body, p, h1 {
  margin: 0;
  padding: 0;
}
</style>